<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width,initial-scale=1">
  <meta http-equiv="X-UA-Compatible" content="ie=edge">
  <title>index</title>
  <link rel="stylesheet" href="css/style.css" />
  <link rel="stylesheet" type="text/css" href="js/layui/css/layui.css">
  <link rel="stylesheet" type="text/css" href="font-awesome/css/font-awesome.min.css">
</head>
<body>
<div class="section">
		<div class="login_title">
			<div class="nav_title active">
				<img src="images/nav_title_icon.png">
				<span>重置密码</span>
			</div>
			<div class="nav_num">
				<i>2</i>
				<p> / 2</p>
			</div>
		</div>

		<div class="login_nr">
			<ul>
				<li>
					<span>电话号码</span>
					<input type="text" name="" placeholder="请输入邮箱/电话">
				</li>
				<li class="error">
					<span>新密码</span>
					<input type="text" name="" placeholder="再次输入密码确认">
					<p class="loginTips">两次密码不一致</p>
				</li>
			</ul>
			<div class="login_find">
				<button class="find_close">取消</button>
				<button id="next">确认重置密码</button>
			</div>
		</div>
	</div>
</body>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/layui/layui.js"></script>
<script type="text/javascript">
	$(function(){
		// 切换注册
        $('#next').click(function(){
			parent.layer.closeAll();
			parent.layer.open({
				type: 2,
				title: '',
				shadeClose: true,
				shade: 0.8,
				area: ['520px', '420px'],
				content: 'success.html' //iframe的url
			}); 
		});

		$('.login_nr ul li input').focus(function(){
        	$(this).parents('li').removeClass('error');
        	$(this).parents('li').addClass('active');
        });

        $('.login_nr ul li input').blur(function(){
        	$(this).parents('li').removeClass('active');
		});
	})

	function find_close(){
		parent.layer.closeAll();
	}
</script>
</html>	